// map.js

// 28.18393,112.935489  岳麓山
// 28.216106,112.862015 东方红大厦

import qqMap from '../../../utils/qqmap.js'

Page({
  data: {
    polyline: [],
    markers: [
      {
        id: 1,
        latitude: 28.216106,
        longitude: 112.862015,
        width: 24,
        height: 30,
      },
      {
        id: 2,
        latitude: 28.18393,
        longitude: 112.935489,
        iconPath: '/static/images/marker.png',
        width: 40,
        height: 40,
      },
    ],

    detail: {}, // 详情数据

    // 下面是地图中心点：默认是东方红大厦的坐标
    latitude: 28.216106,
    longitude: 112.862015,
  },

  async cancelRepair() {
    await wx.http({
      method: 'put',
      url: '/cancel/repaire/' + this.options.id,
    })

    // 更新列表数据中的状态

    const pages = getCurrentPages()
    const listPage = pages.find((v) => v.route === 'repair_pkg/pages/list/index')
    listPage.updateRepairItemStatus(this.options.id, 0)

    wx.navigateBack()
  },

  goEdit() {
    wx.navigateTo({
      url: '/repair_pkg/pages/form/index?id=' + this.options.id,
    })
  },

  async onShow() {
    console.log(this.options)
    const res = await wx.http({ url: '/repair/' + this.options.id })
    this.setData({ detail: res.data })

    this.getPolyline()
  },

  getPolyline() {
    qqMap.direction({
      mode: 'bicycling',
      from: '28.18393,112.935489', // 岳麓山
      to: '28.216106,112.862015', // 东方红大厦
      success: (res) => {
        console.log(res, 'res')
        const ret = res
        const coors = ret.result.routes[0].polyline,
          pl = []
        //坐标解压（返回的点串坐标，通过前向差分进行压缩）
        const kr = 1000000
        for (let i = 2; i < coors.length; i++) {
          coors[i] = Number(coors[i - 2]) + Number(coors[i]) / kr
        }
        //将解压后的坐标放入点串数组pl中
        for (let i = 0; i < coors.length; i += 2) {
          pl.push({ latitude: coors[i], longitude: coors[i + 1] })
        }
        console.log(pl, '一系列的点。。。')

        this.setData({
          // 取所有点中的第一个点的坐标，作为地图的中心点，在这里，就是师傅的位置
          latitude: pl[0].latitude,
          longitude: pl[0].longitude,

          polyline: [
            // 一个对象就是地图上的一条路线，可以同时绘制多条路线
            {
              points: pl,
              color: '#5591af',
              width: 4,
            },
          ],
        })
      },
    })
  },
})
